import useGetData from '@hooks/useGetData';
import React, { useEffect, useState } from "react";
import { AcademicCapIcon, ClipboardDocumentCheckIcon, TableCellsIcon, DocumentTextIcon } from '@heroicons/react/20/solid'
import { useParams } from 'react-router-dom';
import { HeaderCard } from './HeaderCard';
import { Spin } from 'antd';
import { CollegeTabs } from './CollegeTabs';
import { CollegeOverviewComponent } from './CollegeOverviewComponent';
import { AdmissionBrochureComponent } from './AdmissionBrochureComponent';
import { ScoreDetailsComponent } from './ScoreDetailsComponent';
import { AdmissionPlanComponent } from './AdmissionPlanComponent';
export default function CollegeProfile() {
  const { pageid } = useParams();
  const apiUrl = `/api/school/get_school_info/${pageid}`;

  const [schoolData, schoolDataloading] = useGetData(apiUrl);

  const tabs = [
    { name: '院校概况', showComponent: CollegeOverviewComponent, icon: AcademicCapIcon },
    { name: '分数详情', showComponent: ScoreDetailsComponent, icon: TableCellsIcon },
    { name: '招生计划', showComponent: AdmissionPlanComponent, icon: ClipboardDocumentCheckIcon },
    { name: '招生简章', showComponent: AdmissionBrochureComponent, icon: DocumentTextIcon },
  ]
  const [currentTab, setCurrentTab] = useState(tabs[0] || null);

  return (
    <Spin spinning={schoolDataloading}>
      <main className="mx-auto max-w-2xl py-4 sm:py-8 lg:max-w-7xl">
        <HeaderCard schoolData={schoolData} />
        <CollegeTabs tabs={tabs} currentTab={currentTab} setCurrentTab={setCurrentTab} />
        {currentTab && <currentTab.showComponent schoolData={schoolData} pageid={pageid} />}
      </main>

    </Spin>
  )
}
